<template>
  <div>
    <img id="barcode">
  </div>
</template>

<script>
import JsBarcode from 'jsbarcode';
export default {
  name: 'Barcode',
  props: {
    value: {
      type: String,
      default: '1234'
    },
    text: {
      type: String,
      default: undefined
    },
    format: {
      type: String,
      default: 'CODE128'
    },
    width: {
      type: Number,
      default: 1
    },
    height: {
      type: Number,
      default: 40
    },
    displayValue: {
      type: Boolean,
      default: false
    },
    lineColor: {
      type: String,
      default: '#000000'
    },
    background: {
      type: String,
      default: '#ffffff'
    },
    fontSize: {
      type: String,
      default: '14px'
    }
  },
  data() {
    return {};
  },
  mounted() {
    JsBarcode('#barcode', this.value, {
      format: this.format,
      width: this.width,
      height: this.height,
      lineColor: this.lineColor,
      displayValue: this.displayValue,
      fontSize: this.fontSize,
      background: this.background
    });
  }
};
</script>
